<script setup>
import uniNavBar from "../../uni_modules/uni-nav-bar/components/uni-nav-bar/uni-nav-bar.vue";
import Student_tabbar from "./student_tabbar.vue";

const toNext = function () {
  uni.navigateTo({url: '/pages/apply/apply_register'})
}

const toNext_1 = function () {
  uni.navigateTo({url: '/pages/apply/showPages'})
}

const toNext_2 = function () {
  uni.navigateTo({url: '/pages/yemian/showPagesCheng'})
}

const toNext_3 = function () {
  uni.navigateTo({url: '/pages/fanxiao/showPagesYang'})
}

const toNext_4 = function () {
  uni.navigateTo({url: '/pages/shenhe/showPagesShi'})
}

const toNext_5 = function () {
  uni.navigateTo({url: '/pages/teacher_pages/otherPages/examine'})
}
</script>

<template>
  <student_tabbar :current-index="0"/>
  <view class="top-background">
  </view>
  <view id="background">
    <view id="h1">
      <view class="picture">
      </view>
    </view>
  </view>
  <view id="h2">
    当前暂无进行中的请假申请~
  </view>
  <button id="button_1" style="color: #f8f8f8" @click="toNext">发起请假</button>
  <view id="background_1">
    <view id="tempButton" @click="toNext_1">
      <view id="word">
        请假等待页面
      </view>
    </view>
  </view>
  <view id="background_1">
    <view id="tempButton" @click="toNext_2">
      <view id="word">
        请假详情页面
      </view>
    </view>
  </view>
  <view id="background_1">
    <view id="tempButton" @click="toNext_3">
      <view id="word">
        申请返校页面
      </view>
    </view>
  </view>
  <view id="background_1">
    <view id="tempButton" @click="toNext_4">
      <view id="word">
        返校详情页面
      </view>
    </view>
  </view>
  <view id="background_1">
    <view id="tempButton_1" @click="toNext_5">
      <view id="word">
        教师页面
      </view>
    </view>
  </view>
</template>

<style scoped>
.top-background {
  width: 100%;
  height: 119px;
  background: linear-gradient(180.00deg, #2264ff 0%, #f5f5f5 100%);
}

#background {
  display: flex;
  justify-content: center;
}

#background_1 {
  display: flex;
  justify-content: center;
}

#word {
  margin-top: 6px;
}

.picture {
  transform: scale(0.5);
  margin-top: -100px;
  margin-left: -50px;
  width: 800px;
  height: 500px;
  background: url("../../static/image/picture/readingBookGirl.png");
}

#h1 {
  display: flex;
  width: 600px;
  height: 400px;
  justify-content: center;
}

#h2 {
  margin-top: -130px;
  font-weight: 400;
  font-size: 16px;
  letter-spacing: 0.08px;
  text-align: center;
  color: #808080;
}

#button_1 {
  margin-top: 150px;
  width: 283px;
  height: 50px;
  border-radius: 25px;
  background: #2264ff;
  box-shadow: 0 5px 10px #2264ff33;
}

#tempButton {
  width: 80px;
  height: 30px;
  background: #2264ff;
  box-shadow: 0 5px 10px #2264ff33;
  font-size: 11px;
  font-weight: 400;
  color: #f8f8f8;
  text-align: center;
  border-radius: 20px;
  margin-top: 20px;
}

#tempButton_1 {
  width: 80px;
  height: 30px;
  background: #2264ff;
  box-shadow: 0 5px 10px #2264ff33;
  font-size: 11px;
  font-weight: 400;
  color: #f8f8f8;
  text-align: center;
  border-radius: 20px;
  margin-top: 20px;
  margin-bottom: 100px;
}
</style>